{% load staticfiles %}
<!--atsystem-->
<!DOCTYPE html>
<html class="no-js">
    
    <head>
        <title>{% block title %}{% endblock %}</title>
        <!-- Bootstrap -->
        {% block css %}
	<link REL="SHORTCUT ICON" HREF="{% static 'images/favicon.ico' %}">
        <script src="{% static 'vendors/jquery-1.9.1.js' %}"></script>
        <script src="{% static 'vendors/jquery-1.9.1.min.js' %}"></script>
	<script src="{% static 'artDialog/lib/jquery-1.10.2.js'%}"></script>
	<link href="{% static 'artDialog/css/ui-dialog.css'%}" rel="stylesheet">
	<script src="{% static 'artDialog/dist/dialog-min.js'%}"></script>
        <link href="{% static 'bootstrap/css/tanchuang.css' %}" rel="stylesheet" media="screen">
        <link href="{% static 'bootstrap/css/bootstrap.min.css' %}" rel="stylesheet" media="screen">
	<link href="{% static 'vendors/fullcalendar/fullcalendar.css' %}" rel="stylesheet" media="screen">
        <link href="{% static 'bootstrap/css/bootstrap-responsive.min.css' %}" rel="stylesheet" media="screen">


        <link href="{% static 'vendors/easypiechart/jquery.easy-pie-chart.css' %}" rel="stylesheet" media="screen">
        <link href="{% static 'assets/styles.css' %}" rel="stylesheet" media="screen">
        <link href="{% static 'assets/DT_bootstrap.css' %}" rel="stylesheet" media="screen">
       {%  endblock %}
        <!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
        <!--[if lt IE 9]>
            <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
        <![endif]-->
        <script src="{% static 'vendors/modernizr-2.6.2-respond-1.1.0.min.js' %}"></script>
    </head>
    
    <body background="{% static 'images/backgroud.jpg' %}" height: 300px">
        <div class="navbar navbar-fixed-top">
            <div class="navbar-inner">
                <div class="container-fluid">
                    <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> <span class="icon-bar"></span>
                     <span class="icon-bar"></span>
                     <span class="icon-bar"></span>
                    </a>
                   <a class="brand" href="#"><img data-src="holder.js/260x180" alt="260x180" style="width: 120px; height: 30px;" src="{% static 'images/260180.jpg' %}"/></a>
                    <div class="nav-collapse collapse">
                        <ul class="nav pull-right">
                            <li class="dropdown">
                                <a href="#" role="button" class="dropdown-toggle" data-toggle="dropdown"> <span class="badge badge-success pull-right">{{c_count}}</span><i class="icon-user"></i>{{username}}<i class="caret"></i>
                                </a>
                                <ul class="dropdown-menu">
                                    <li>
                                        <a tabindex="-1" href="/admin/account/userinfo/{{username}}">Profile</a>
                                    </li>
                                    <li>
                                        <a tabindex="-1" href="/admin/account/usercal/{{username}}"><span class="badge badge-success pull-right">{{c_count}}</span>Calendar</a>
                                    </li>
                                    <li class="divider"></li>
                                    <li>
                                        <a tabindex="-1" href="/logout/">Logout</a>
                                    </li>
                                </ul>
                            </li>
                        </ul>
                        <ul class="nav">
                            <li>
<!--                            <li class="active"> -->
                                <a href="/admin/">Dashboard</a>
                            </li>
                            <li class="dropdown">
                                <a href="#" data-toggle="dropdown" class="dropdown-toggle">Settings <b class="caret"></b>

                                </a>
                                <ul class="dropdown-menu" id="menu1">
                                    <li>
                                        <a href="#">Tools <i class="icon-arrow-right"></i>

                                        </a>
                                        <ul class="dropdown-menu sub-menu">
                                            <li>
                                                <a href="#">Reports</a>
                                            </li>
                                            <li>
                                                <a href="#">Logs</a>
                                            </li>
                                            <li>
                                                <a href="#">Errors</a>
                                            </li>
                                        </ul>
                                    </li>
                                    <li>
                                        <a href="#">SEO Settings</a>
                                    </li>
                                    <li>
                                        <a href="#">Other Link</a>
                                    </li>
                                    <li class="divider"></li>
                                    <li>
                                        <a href="#">Other Link</a>
                                    </li>
                                    <li>
                                        <a href="#">Other Link</a>
                                    </li>
                                </ul>
                            </li>
                            <li class="dropdown">
                                <a href="#" role="button" class="dropdown-toggle" data-toggle="dropdown">Content <i class="caret"></i>

                                </a>
                                <ul class="dropdown-menu">
                                    <li>
                                        <a tabindex="-1" href="#">Blog</a>
                                    </li>
                                    <li>
                                        <a tabindex="-1" href="#">News</a>
                                    </li>
                                    <li>
                                        <a tabindex="-1" href="#">Custom Pages</a>
                                    </li>
                                    <li>
                                        <a tabindex="-1" href="#">Calendar</a>
                                    </li>
                                    <li class="divider"></li>
                                    <li>
                                        <a tabindex="-1" href="#">FAQ</a>
                                    </li>
                                </ul>
                            </li>
                            <li class="dropdown">
                                <a href="#" role="button" class="dropdown-toggle" data-toggle="dropdown">Users <i class="caret"></i>

                                </a>
                                <ul class="dropdown-menu">
                                    <li>
                                        <a tabindex="-1" href="/admin/account/">User List</a>
                                    </li>
                                    <li>
                                        <a tabindex="-1" href="#">Search</a>
                                    </li>
                                    <li>
                                        <a tabindex="-1" href="#">Permissions</a>
                                    </li>
                                </ul>
                            </li>
                        </ul>
                    </div>
                    <!--/.nav-collapse -->
                </div>
            </div>
        </div>
        <div class="container-fluid">
            <div class="row-fluid">
                <div class="span3" id="sidebar">
                    <ul class="nav nav-list bs-docs-sidenav nav-collapse collapse">
                        <li>
<!--                        <li class="active"> -->
                            <a href="/admin/"><i class="icon-chevron-right"></i> Dashboard</a>
                        </li>
<!--                        <li>
                            <a href="calendar.html"><i class="icon-chevron-right"></i> Calendar</a>
                        </li>
                        <li>
                            <a href="stats.html"><i class="icon-chevron-right"></i> Statistics (Charts)</a>
                        </li>
                        <li>
                            <a href="form.html"><i class="icon-chevron-right"></i> Forms</a>
                        </li>
                        <li>
                            <a href="tables.html"><i class="icon-chevron-right"></i> Tables</a>
                        </li>
                        <li>
                            <a href="buttons.html"><i class="icon-chevron-right"></i> Buttons & Icons</a>
                        </li>
                        <li>
                            <a href="editors.html"><i class="icon-chevron-right"></i> WYSIWYG Editors</a>
                        </li>
                        <li>
                            <a href="interface.html"><i class="icon-chevron-right"></i> UI & Interface</a>
                        </li>
                        <li>
                            <a href="#"><span class="badge badge-success pull-right">731</span> Orders</a>
                        </li>
                        <li>
                            <a href="#"><span class="badge badge-success pull-right">812</span> Invoices</a>
                        </li>
                        <li>
                            <a href="#"><span class="badge badge-info pull-right">27</span> Clients</a>
                        </li>
		<li class = "active">
-->			{% if 'auth.add_user' in perms  %}
      			<li>
			<a href="/admin/account/"><span class="badge badge-success pull-right">{{u_count}}</span> Users</a>
			</li>
      			<li>
			<a href="/admin/groups/"><span class="badge badge-success pull-right">{{g_count}}</span> Groups</a>
			</li>
			{% endif %}
                        <li>
                            <a href="/admin/hosts/"><span class="badge badge-info pull-right">{{m_count}}</span> Minions List</a>
                        </li>
                        <li>
                            <a href="/admin/mgroups/"><span class="badge badge-warning pull-right">{{mg_count}}</span> Minion Group</a>
                        </li>

                        {% if 'auth.add_user' in perms  %}
                        <li>
                            <a href="/admin/tasks/"><span class="badge badge-warning pull-right">{{t_count}}</span> System Tasks</a>
                        </li>
                         {% endif %}


<!--                        <li>
                            <a href="#"><span class="badge badge-info pull-right">11</span> Reports</a>
                        </li>
                        <li>
                            <a href="#"><span class="badge badge-important pull-right">83</span> Errors</a>
                        </li>
                        <li>
                            <a href="#"><span class="badge badge-warning pull-right">4,231</span> Logs</a>
                        </li>
-->
                    </ul>
                </div>
             {% block content %}{% endblock %}   
            <hr>
	    {% block footer %}
            <footer>
                <p>&copy; Extend SaltStack 2015 </p>
            </footer>
             {% endblock %}
        </div>
        <!--/.fluid-container-->
        

        <link href="{% static 'vendors/datepicker.css' %}" rel="stylesheet" media="screen">
        <link href="{% static 'vendors/uniform.default.css' %}" rel="stylesheet" media="screen">
        <link href="{% static 'vendors/chosen.min.css' %}" rel="stylesheet" media="screen">
        <link href="{% static 'vendors/wysiwyg/bootstrap-wysihtml5.css' %}" rel="stylesheet" media="screen">



        <script src="{% static 'vendors/jquery-1.9.1.js' %}"></script>
        <script src="{% static 'vendors/jquery.uniform.min.js' %}"></script>
        <script src="{% static 'vendors/chosen.jquery.min.js' %}"></script>
        <script src="{% static 'vendors/bootstrap-datepicker.js' %}"></script>
        <script src="{% static 'vendors/wysiwyg/wysihtml5-0.3.0.js' %}"></script>
        <script src="{% static 'vendors/wysiwyg/bootstrap-wysihtml5.js' %}"></script>
        <script src="{% static 'vendors/wizard/jquery.bootstrap.wizard.min.js' %}"></script>
        <script type="text/javascript" src="{% static 'vendors/jquery-validation/dist/jquery.validate.min.js' %}"></script>




        <script src="{% static 'assets/form-validation.js' %}"></script>
        <script src="{% static 'vendors/jquery-1.9.1.min.js' %}"></script>
        <script src="{% static 'bootstrap/js/bootstrap.min.js' %}"></script>
        <script src="{% static 'vendors/fullcalendar/fullcalendar.js' %}"></script>
        <script src="{% static 'vendors/fullcalendar/gcal.js' %}"></script>
        <script src="{% static 'vendors/easypiechart/jquery.easy-pie-chart.js' %}"></script>
        <script src="{% static 'vendors/datatables/js/jquery.dataTables.min.js' %}"></script>
        <script src="{% static 'assets/scripts.js' %}"></script>
        <script src="{% static 'assets/DT_bootstrap.js' %}"></script>
<!-- /////-->
	<script>
        $(function() {
            // Easy pie charts
            $('.chart').easyPieChart({animate: 1000});
        });
        </script>
<!-- /////-->
        <script>
        jQuery(document).ready(function() {   
           FormValidation.init();
        });
        

        $(function() {
            $(".datepicker").datepicker();
            $(".uniform_on").uniform();
            $(".chzn-select").chosen();
            $('.textarea').wysihtml5();

            $('#rootwizard').bootstrapWizard({onTabShow: function(tab, navigation, index) {
                var $total = navigation.find('li').length;
                var $current = index+1;
                var $percent = ($current/$total) * 100;
                $('#rootwizard').find('.bar').css({width:$percent+'%'});
                // If it's the last tab then hide the last button and show the finish instead
                if($current >= $total) {
                    $('#rootwizard').find('.pager .next').hide();
                    $('#rootwizard').find('.pager .finish').show();
                    $('#rootwizard').find('.pager .finish').removeClass('disabled');
                } else {
                    $('#rootwizard').find('.pager .next').show();
                    $('#rootwizard').find('.pager .finish').hide();
                }
            }});
            $('#rootwizard .finish').click(function() {
                alert('Finished!, Starting over!');
                $('#rootwizard').find("a[href*='tab1']").trigger('click');
            });
        });
        </script>

    </body>

</html>
